import React from 'react';
import {
  Platform,
  Text,
  Image,
  FlatList,
  TouchableOpacity,
  View
} from 'react-native';
import { TableList,PlaceHolderView,BaseComponent,NavBar } from '../wedgets';
import { Fetch } from '../lib';

export default class Weathers extends BaseComponent {
  static navigationOptions = ({ navigation }) => ({
    header:<NavBar 
    title={navigation.state.params.title} 
    navigation={navigation} 
    enableBackBtn={true} 
    backColor={'#fff'}
    titleColor={'#fff'} />
  })

  //list请求数据实现入口,这里请求城市列表
  fetchData = async() => {
    //模仿数据下拉加载
    let area_code = this.props.navigation.state.params.area_code||'';
    console.log('========>',area_code);
    new Fetch({
      //typescript写法直接给字符串插入参数101010100.html
      url:`http://www.weather.com.cn/data/sk/${area_code}.html`,
      method:'get',
    }).dofetch().then((res)=>{
      console.log('res0000000>',res);
    }).catch((err)=>{
      abortFetch()
    })
  }


  render() {
    const { navigation } = this.props;
    return (
        <View style={{flex:1}}>
          <TableList
            ref={list => this.list = list}
            style={{ backgroundColor: 'white' }}
            onFetch={this.fetchData}
            renderItem={this.renderRow}
            keyExtractor={item => item.id}
            pagination={false}
            initialNumToRender={10}
            paginationType={'value'}
            PaginationFetchingView={() => {
              return [
                <PlaceHolderView type={'video'} key={'top'} />,
                <PlaceHolderView type={'video'} key={'center'} />,
                <PlaceHolderView type={'video'} key={'bottom'} />
              ];
            }}
          />
        </View>

    );
  }
}



